<template>
    <div class="box">
        账号：
        <el-input v-model="account" placeholder="请输入内容"></el-input>
        <!-- 密码:
        <el-input v-model="password" placeholder="请输入内容"></el-input> -->
        电话：
        <el-input v-model="phone" placeholder="请输入内容"></el-input>信用值：
        <el-input v-model="credits" placeholder="请输入内容"></el-input>
        <el-button type="success" plain @click="sureupdata">确认修改</el-button>
        <el-button type="info" plain @click="reset">重置按钮</el-button>
    </div>
</template>

<script>
import { createNamespacedHelpers } from "vuex";
const { mapState, mapActions, mapMutations } = createNamespacedHelpers(
    "admins"
);
export default {
    async mounted() {
        //将要修改的数据渲染到对应的地方
        var lessors = await this.getLessors();
        var newpagerows = lessors.pagerows;
        var newlessors = newpagerows.filter(elem => {
            return elem._id == this.id;
        });
        this.account = newlessors[0].account;
        this.password = newlessors[0].password;
        this.phone = newlessors[0].phone;
        this.credits = newlessors[0].credits;
    },
    props: ["id"],
    data() {
        return {
            account: "",
            password: "",
            phone: "",
            credits: ""
        };
    },
    methods: {
        ...mapActions(["getLessors", "EditLessors", "deleteLessors"]),
        //重置按钮
        reset() {
            (this.account = ""),
                (this.password = ""),
                (this.phone = ""),
                (this.credits = "");
        },
        sureupdata() {
            this.EditLessors({
                _id: this.id,
                account: this.account,
                password: this.password,
                credits: this.credits
            });
        }
    }
};
</script>

<style scoped>
.box {
    width: 40%;
    margin: 0 auto;
    margin-top: 30px;
}
.el-input {
    margin-bottom: 20px;
}
</style>